import React,{Component} from 'react'

import {
    StyleSheet,
  View,
  Text,
  Image,
   FlatList,
  Dimensions,
  TouchableOpacity,
} from 'react-native'

import Change from './change'

const { width, height } = Dimensions.get('window');


const leftwidth=width/5
const rightwidth=width*4/5
const imgwidth=width*4/25
const rightwidth1=width*16/25


var styles=StyleSheet.create({
 
   
   
    changewarp:{
        width:100,
        padding:10,
        flexDirection:'row',
        justifyContent:'space-around',
        alignItems:'center'
    },
  
  
  
   single:{
        width:'100%',
    },
   
   types1:{
        backgroundColor:'white',
        flexDirection:'row',
        padding:10,
        alignItems:'center',
        justifyContent:'space-between',
        height:imgwidth+30
    },
    singleimg:{
        width:imgwidth,
        height:imgwidth,
        borderRadius:5,
        paddingTop:'20%',
    },
    singleright:{
        width:rightwidth1,
        height:imgwidth+20,
        flexDirection:'column',
        padding:10,
        justifyContent:'space-around',
    },
    chosetype:{
        backgroundColor:'#1296db',
        color:'white',
        borderRadius:10,
        padding:3
    },
    single:{
        width:'100%',
    },
    changewarp:{
      width:'100%',
      flexDirection:'row',
      paddingLeft:0,
      paddingRight:15,
      justifyContent:'space-between',
      alignItems:'center'
    },
   
    
   
    
   
   types:{
     width:'100%',
     height:70,
     flexDirection:'column',
     justifyContent:'center',
     backgroundColor:'white'
   },
   typetext:{
     textAlign:'left',
     color:'black',
     paddingTop:5
   }
})




export default class Listin extends Component{
    constructor(props) {
    super(props);
   
    }

shouldComponentUpdate(nextProps, nextState) {
    return true
    
  }

    render(){
        return(
            <View
                        style={styles.types1}
                        >
                        <Image
                        source={{uri:global.imgurl+this.props.item.item.src}}
                        style={styles.singleimg}
                        
                        />
                        <View style={styles.singleright}>
                        <Text style={styles.typetext}
                        numberOfLines={1}
                        >
                        {this.props.item.item.listName}
                        
                        </Text>
                        <View style={styles.changewarp}>
                        <Text style={styles.typetext}>
                        {this.props.item.item.listin[0].price}
                        </Text>
                        {this.props.item.item.listin.length>1
                        ?
                        <Text 
                        onPress={
                            ()=>{
                                this.props.showspecif()
                            }
                        }
                        style={styles.chosetype}>
                        选规格
                        </Text>
                        
                        :
                        <Change makesure={()=>{}}   data={this.props.item.item.listin[0]} />
                        }
                        </View>
                        </View>
                        </View>
        )
    }
}